/// <reference path="../../sage/sage.util.js" />

var SkyPainter = Base.extend({
    initialize: function initialize() {
        this.SECTION_COUNT = 6;
        this.MAGIC_NUMBER = 180.0;
    },
    paint: function paint(context) {
        var viewWidth = context.viewPort.size.w,
			skyHeight = Math.round(context.viewPort.size.h / 2.0),
			stripeWidth = Math.round(viewWidth / this.SECTION_COUNT);

        var transparentSkyBlue = "#8DD0EB",
			transparentLightBlue = "#A6D6E7";

        context.backLayer.fillStyle = transparentSkyBlue;
        context.backLayer.fillRect(0, 0, viewWidth, skyHeight);

        var rects = [], 
			b = false,
			width = 0;
        for (var x = 0; x < viewWidth; x++)
        {
            var num = x - Math.floor(context.camera.lineOfSight * this.MAGIC_NUMBER),
				l = num % stripeWidth;
            if (l < 0) l += stripeWidth; // Reverse.
            if (l < stripeWidth / 2)
            {
                b = true;
                width++;
            }
            else
            {
                if (b)
                {
                    rects.push(Rectangle.newInstance(x - width, 0, width, skyHeight));
                    b = false;
                    width = 0;
                }
            }
        }
        rects.push(Rectangle.newInstance(viewWidth - width, 0, width, skyHeight));

        context.backLayer.fillStyle = transparentLightBlue;
        var rect;
        for (var i=0; i < rects.length; i++)
        {
            rect = rects[i];
            context.backLayer.fillRect(rect.x, rect.y, rect.w, rect.h);
        }
    }
});